/*
 * Questa funzione crea uno smokey popup contenente il codice html dato
 * e restituisce il nuovo codice html
 * in pratica è un wrapper
 */
function createSmokeyPopup(html){
    document.getElementById("popupContainer").innerHTML=''+
    '<div class="smokey"></div>'+
    '<div class="popup invertedGradient">'+
    '<a class="ctrlPopup" href="javascript:void(0)" onclick="closePopup()">chiudi</a>'+
    html+
    '</div>';
}

//funzione per chiudere un popup aperto
function closePopup(){
    document.getElementById("popupContainer").innerHTML='';
}

//funzione per creare un popup a forma di fumetto
//il triangolo del fumetto può trovarsi nel lato superiore o inferiore, in base a dove c'è più spazio
function createBaloonPopup(html, event){

    maxX = window.innerWidth;
    maxY = window.innerHeight;

    
    //window.alert("maxX="+maxX+", maxY="+maxY);
    
    clickX = parseInt(event.pageX);
    clickY = parseInt(event.pageY);
    
    d = 75; //distanza tra la freccia e la fine del baloon
    
    if (maxY - clickY > clickY){
        //freccia su
       document.getElementById("popupContainer").innerHTML=''+
        '<div id="baloonPopup">'+
        '   <div id="popupHeader">'+
        '       <img id="popupArrow" src="img/baloonUp.png"/>'+
        '   </div>'+
        '   <div class="popupBody gradient">'+
        '       <a class="ctrlPopup" href="javascript:void(0)" onclick="closePopup()">chiudi</a>'+
                html+
        '   </div>'+
        '</div>'; 
    }
    else{
        //freccia giù
        document.getElementById("popupContainer").innerHTML=''+
        '<div id="baloonPopup">'+
        '   <div class="popupBody gradient">'+
        '       <a class="ctrlPopup" href="javascript:void(0)" onclick="closePopup()">chiudi</a>'+
                html+
        '   </div>'+
        '   <div id="popupHeader">'+
        '       <img src="img/baloonDown.png"/>'+
        '   </div>'+
        '</div>';
    }
    

    ph = document.getElementById("popupHeader");
    bp = document.getElementById("baloonPopup");
    
      
        
    if(maxY - clickY > clickY){
        //freccia top
        bp.style.top = clickY+"px";
        //window.alert("imposto il top a " + bp.style.top);
    }
    else{
        //freccia bottom
        y = maxY - clickY;
        bp.style.bottom = y+"px";
        //window.alert("imposto il bottom a " + bp.style.bottom);
    }        
    if (maxX - clickX > clickX){
        //freccia left
        x = clickX - d;
        bp.style.left = x+"px";
        ph.className = "leftArrow";
        //window.alert("imposto il left a " + bp.style.left);
    }
    else{
        //freccia right
        x = maxX - (clickX + d);
        bp.style.right = x+"px";
        ph.className = "rightArrow";
        //window.alert("imposto il right a " + bp.style.right);
    }
    
}

//svuota l'elemento il cui id è specificato da where
function clear(where){
    document.getElementById(where).innerHTML='';
}

//fornisce un feedback temporaneo
function giveFeedback(feedback){
    document.getElementById("feedbackContainer").innerHTML="<div class='feedback'>"+feedback+"</div>";
    var t = setTimeout("clear('feedbackContainer')", 10000);
}
